<template>
  <div class="inputnumber">
    <el-row :gutter="5">
      <el-col :span="8">
        <el-input-number v-model="number1"></el-input-number>
      </el-col>

      <el-col :span="8">
        <el-input-number v-model="number2" :min="1" :max="10" @change="change"></el-input-number>
      </el-col>

      <el-col :span="8">
        <el-input-number v-model="number2" :step="2" :precision="2"></el-input-number><!-- step:步长，一次增加多少个 / precision:小数点精度 -->
      </el-col>

      <el-col :span="8">
        <el-input-number v-model="number1" :precision="2" controls-position="right"></el-input-number><!-- controls-position：设置增减按钮的位置 -->
      </el-col>

    </el-row>
  </div>
</template>

<script>
  export default {
    name: "InputNumber",
    data() {
      return {
        number1: 1,
        number2: 1
      }
    },
    // 方法
    methods: {
      change(value) {
        console.log(value)
      }
    },
  }
</script>

<style scope>
.el-col{
  margin:20px 0;
}

</style>